<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
		<meta name="author" content="www.frebsite.nl" />
		<meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />
		<meta name="robots" content="noindex, nofollow" />

		<title>jQuery.mmenu &raquo; Options</title>

		<link type="text/css" rel="stylesheet" href="../docs.css" />
		<link type="text/css" rel="stylesheet" href="../../mmenu.css" />
		
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
		<script type="text/javascript" src="../../jquery.mmenu.min.js"></script>
		<script type="text/javascript">
			$(function() {
				$('nav#menu').mmenu();
			});
		</script>
	</head>
	<body>
		<div id="page">
			<div id="header">
				<a href="#menu"></a>
				Options
			</div>
			<div id="content">
				<h4>configuration <small><em>(object)</em></small></h4>
				<p>A map of options for technical details.</p>
				<br />
				<p>Code example:</p>
<pre>
$(&quot;#my-menu&quot;).mmenu({
   configuration: {
      clone                : false,
      hardwareAcceleration : true,
      preventTabbing       : true,
      selectedClass        : &quot;Selected&quot;,
      labelClass           : &quot;Label&quot;,
      counterClass         : &quot;Counter&quot;,
      pageSelector         : undefined,
      pageNodetype         : &quot;div&quot;,
      menuNodetype         : &quot;nav&quot;,
      transitionDuration   : 500
   }
});
</pre>
				<br />
				<h5>configuration.clone <small><em>(boolean)</em></small></h5>
				<p>Whether or not to use a clone of the original <code>&lt;nav&gt;</code>.<br />
					If <code>true</code>, all <code>ID</code>-attributes in the clone will be prefixed with <code>&quot;mm-&quot;</code>.</p>
				<p>Default value: <code>false</code>.</p>

				<h5>configuration.hardwareAcceleration <small><em>(boolean)</em></small></h5>
				<p>Whether or not to force hardware acceleration on the CSS transitions.</p>
				<p>Default value: <code>true</code>.</p>

				<h5>configuration.preventTabbing <small><em>(boolean)</em></small></h5>
				<p>Whether or not to &quot;disable&quot; the tab-button when the menu is opened.<br />
					If <code>false</code>, make sure to still prevent the user from tabbing outside the menu.</p>
				<p>Default value: <code>true</code>.</p>

				<h5>configuration.selectedClass <small><em>(string)</em></small></h5>
				<p>The classname on the currently selected <code>LI</code>.</p>
				<p>Default value: <code>&quot;Selected&quot;</code>.</p>

				<h5>configuration.labelClass <small><em>(string)</em></small></h5>
				<p>The classname on the <code>LI</code>s that function as a label.</p>
				<p>Default value: <code>&quot;Label&quot;</code>.</p>
				
				<h5>configuration.counterClass <small><em>(string)</em></small></h5>
				<p>The classname on the <code>EM</code>s that function as a counter.</p>
				<p>Default value: <code>&quot;Counter&quot;</code>.</p>

				<h5>configuration.pageSelector <small><em>(string)</em></small></h5>
				<p>The jQuery selector to find the page.</p>
				<p>If <code>undefined</code>, it will be set to <code>&quot;&gt; &quot; + configuration.pageNodetype</code>.</p>

				<h5>configuration.pageNodetype <small><em>(string)</em></small></h5>
				<p>The nodetype of the page.</p>
				<p>Default value: <code>&quot;div&quot;</code>.</p>

				<h5>configuration.menuNodetype <small><em>(string)</em></small></h5>
				<p>The nodetype of the menu.</p>
				<p>Default value: <code>&quot;nav&quot;</code>.</p>

				<h5>configuration.transitionDuration <small><em>(number)</em></small></h5>
				<p>The duration of the animations (in milliseconds).</p>
				<p>This value should match the duration of the CSS-transitions.</p>
				<p>Default value: <code>500</code>.</p>
			</div>
			<nav id="menu">
				<ul>
					<li><a href="position.html">position</a></li>
					<li><a href="slidingsubmenus.html">slidingSubmenus</a></li>
					<li><a href="counters.html">counters</a></li>
					<li><a href="searchfield.html">searchfield</a></li>
					<li><a href="dragopen.html">dragOpen</a></li>
					<li><a href="onclick.html">onClick</a></li>
					<li class="Selected"><a href="configuration.html">configuration</a></li>
				</ul>
			</nav>
		</div>
	</body>
</html>